兩大必備Auto模組:
Auto Rename Tag
編輯HTML標籤時,結尾標籤可以自動替換
Auto Close Tag
編輯HTML標籤時,完成起始標籤,自動補齊結尾標籤
其他:
Live Server
本地端開啟可以預覽的網站
HTML Boilerplate
寫HTML時,可以預測你接下來要打的標籤
HTML CSS Support
寫HTML時,可以自動讀取到CSS已經定義好的class、id名稱
Code Spell Checker
檢查你的英文單字有沒有打錯
CSS Peek
從HTML上的Class可以快速找到該CSS的Code
ESLint
檢查Code的排版,讓你跟上主流的編碼風格
Material Icon Theme
如果你是前端工程師一定需要這款能讓VScode的UI變得美美的模組
Path Intellisense
寫路徑的時候,不用再去開檔案總管去看了,直接在Code裡面用看的方式填入路徑
開發Vue必備:
TypeScript Vue Plugin
Vue Language Features
Vue 3 Snippets
裝了 Auto Close Tag 以後,寫 TypeScript 會很痛苦
例如:
Array<string>
<T>
謝謝留言,確實會有這個困擾,我後來習慣先寫出<>,再去填string。
我早期是使用Visual Studio撰寫,寫HTML原本就有Auto Close Tag的效果,而在JS文件或其他文件中撰寫並不會有這個效果。
後來我換到VScode在寫HTML因為不習慣,才會去找這個模組來用,但確實會出現你說的問題,顯然這個模組會在任何文件類型中生效,看你寫作的習慣,若你沒有像我一樣享受過Visual Studio原生便利性的經驗,可能不使用這個模組會比較順手。